<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>商城首页</title>
    <link rel="stylesheet" href="static/css/style.css">
</head>
<body>

<div class="导航0">
    <div class="导航1">
        <div class="导航2">
            <a th:href="@{/toIndex}" th:if="${username}!=null">胖墩服装店首页</a>
            <a th:href="@{/}" th:if="${username}==null">胖墩服装店首页</a><span>|</span>
            <a href="">购物记录</a><span>|</span>
            <a href="/toChat?to=2">客服</a><span>|</span>
            <a href="">待用</a><span>|</span>
            <a href="">待用</a><span>|</span>
            <a href="">待用</a><span>|</span>
        </div>
        <div class="导航3">
            <a th:href="@{/toLogin}" th:if="${username}==null">登录/注册</a>
            <a th:href="@{/input}" th:if="${username}!=null" th:text="'尊敬的'+${username}+'你好'"></a><span>|</span>
            <a href="/logout">注销</a>
        </div>
        <div class="导航4"><a href="/input">开始购物<span>(0)</span></a></div>
    </div>
</div>
<div class="header">
    <div class="header1">
        <div class="header2">
            <a href="" class="lr"></a>
        </div>
        <div class="header3">
            <ul class="list1">
            <li class="header3-item"><a href="" class="item1">全部商品</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
            <li class="header3-item"><a href="" class="item1">待用</a></li>
        </ul>
        </div>
        <div class="header4">
            <form action="" class="search1">
                <input type="search" name="keyword" class="search1-text">
                <input type="submit" value="搜索" class="search1-btn">
            </form>
        </div>

    </div>
</div>
<div class="选项卡">
    <div class="选项logo"></div>
    <div class="选项0">
        <div class="选项">
            <ul id="tab">
                <li class="op"><span>选项</span><em>1</em></li>
                <li ><span>选项</span><em>2</em></li>
                <li ><span>选项</span><em>3</em></li>
                <li ><span>选项</span><em>4</em></li>
                <li ><span>选项</span><em>5</em></li>
            </ul>
        </div>
    </div>
</div>
<div class="goods">
<div class="商品0-1" id="lists">
    <ul class="商品0-2 active">
        <li>
            <div class="bg">
                <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
            </div>
            <div class="info">
                <a htef=""  class="itemName">商品名</a>
                <p class="tips">商品简介</p>
                <p class="pi">价格
                    <!-- 打折用del标签 -->
                </p>
                <a href="" class="buy">购买</a>
            </div>
        </li>
   </ul>
   <ul class="商品0-2 ">
    <li>
        <div class="bg">
            <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
        </div>
        <div class="info">
            <a htef=""  class="itemName">商品名</a>
            <p class="tips">商品简介</p>
            <p class="pi">价格
                <!-- 打折用del标签 -->
            </p>
            <a href="" class="buy">购买</a>
        </div>
    </li>

</ul>
<ul class="商品0-2">
    <li>
        <div class="bg">
            <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
        </div>
        <div class="info">
            <a htef=""  class="itemName">商品名</a>
            <p class="tips">商品简介</p>
            <p class="pi">价格
                <!-- 打折用del标签 -->
            </p>
            <a href="" class="buy">购买</a>
        </div>
    </li>

</ul>
<ul class="商品0-2">
    <li>
        <div class="bg">
            <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
        </div>
        <div class="info">
            <a htef=""  class="itemName">商品名</a>
            <p class="tips">商品简介</p>
            <p class="pi">价格
                <!-- 打折用del标签 -->
            </p>
            <a href="" class="buy">购买</a>
        </div>
    </li>

</ul>
<ul class="商品0-2">
    <li>
        <div class="bg">
            <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
        </div>
        <div class="info">
            <a htef=""  class="itemName">商品名</a>
            <p class="tips">商品简介</p>
            <p class="pi">价格
                <!-- 打折用del标签 -->
            </p>
            <a href="" class="buy">购买</a>
        </div>
    </li>

</ul>
<ul class="商品0-2">
    <li>
        <div class="bg">
            <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
        </div>
        <div class="info">
            <a htef=""  class="itemName">商品名</a>
            <p class="tips">商品简介</p>
            <p class="pi">价格
                <!-- 打折用del标签 -->
            </p>
            <a href="" class="buy">购买</a>
        </div>
    </li>

</ul>
<ul class="商品0-2">
    <li>
        <div class="bg">
            <img src="/static/img/wallhaven-k9e8ym.jpg" alt="clothe1"></img>
        </div>
        <div class="info">
            <a htef=""  class="itemName">商品名</a>
            <p class="tips">商品简介</p>
            <p class="pi">价格
                <!-- 打折用del标签 -->
            </p>
            <a href="" class="buy">购买</a>
        </div>
    </li>

</ul>
</div><p></p>
</div>
<div>
<p class="note">货物出门，概不退还</p>
</div>

<script src="/static/js/fuzhuangdian.js"></script>
</body>
</html>